<template>
	<view class="goods-item" hover-class="hover-class">
		<view @click="onDetail(options.id)">
			<image :src="imgURL+options.indexImg" mode="aspectFill" class="goods-item_cover">
			</image>
			<view class="goods-item_info">
				<text class="goods-item_info_name text-overhidden-2">{{options.productName}}</text>
				<view class="flex-row margin-top-xs">
					<view class="text-sm">慈善价：</view>
					<view class="theme-color ">￥{{options.monovalent}}</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script lang="ts" setup>
	import { imgURL } from '@/api/request';
	defineProps({
		options: {
			required: true,
			type: Object,
			default() {
				return {}
			}
		}
	})
	const onDetail = (id: string) =>{
		uni.navigateTo({
			url: `/pages/supermarket/detail?id=${id}`
		});
	}
</script>

<style scoped lang="scss">
.goods-item {
	&_cover {
		width: 89%;
		height: 200rpx;
		margin: 0 4%;
	}
	&_info {
		width: 93%;
		margin: 10rpx auto;
		&_name {
			height: 70rpx;
			font-size: 28rpx;
			color: #252525;
		}
	}
}
</style>